---
title: Image Card
description: A card component optimized for displaying images with captions.
---

<ComponentPreview component="image-card">
  ```tsx file=<rootDir>/src/examples/ui/image-card.tsx
  ```
</ComponentPreview>

## Installation

<Installation component="image-card">
  ```tsx file=<rootDir>/src/components/ui/image-card.tsx
  ```
</Installation>

## Usage

```ts
import ImageCard from '@/components/ui/image-card'
```

```tsx
<ImageCard
  caption="Image"
  imageUrl="https://hips.hearstapps.com/hmg-prod/images/flowers-trees-and-bushes-reach-their-peak-of-full-bloom-in-news-photo-1678292967.jpg?resize=300:*"
></ImageCard>
```